// get 请求
const xhr = new XMLHttpRequest();

// false 表示的是异步的请求

xhr.open("GET", "/api", false);

// 当readystate 发生变化的时候会触发这个函数

xhr.onreadystatechange = function () {
  // 这里的函数异步执行
  if (xhr.readyState === 4) {
    if (xhr.status === 200) {
      alert(xhr.responseText);
    }
  }
};

// 因为是get 请求，所以不需要传入参数数据，直接发送就好了
xhr.send(null);

// POST 请求
const xhr = new XMLHttpRequest();

// false 表示的是异步的请求

xhr.open("POST", "/api", false);

// 当readystate 发生变化的时候会触发这个函数

xhr.onreadystatechange = function () {
  // 这里的函数异步执行
  if (xhr.readyState === 4) {
    if (xhr.status === 200) {
      alert(xhr.responseText);
    }
  }
};

const postData = {
  userName: "zhangsan",
  password: "xxx",
};
xhr.send(JSON.stringify(postData));

/**
 *
 * @param {string} url
 * @param {string} method
 * @param {object} data
 */
function ajax(url, method, data) {
  if (method !== "GET" || method !== "POST") {
    throw new Error("暂不支持输入的请求方法");
  }

  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();

    xhr.open(method, url, true);

    xhr.onreadystatechange = function () {
      if (xhr.readyState == 4) {
        if (xhr.status === 200) {
          resolve(xhr.responseText);
        } else if (xhr.status === 404) {
          reject(new Error("404 not found"));
        }
      }
    };

    xhr.onerror = function (event) {
      reject(event.loaded);
    };

    if (typeof data === "object") {
      xhr.send(JSON.stringify(data));
    } else {
      xhr.send(null);
    }
  });
}

ajax("/api", "GET", { userName: "cxtao" })
  .then((val) => {
    console.log(value);
  })
  .catch((val) => {
    if (typeof val === "string") {
      console.log("出现错误" + val);
    } else {
      console.log("完成到" + val / 100 + "的时候出现中断");
    }
  });
